<template>
	<view class="container">
		<!-- 新闻列表 -->
		<view class="news-list">
			<view class="news-item" v-for="item in teamList" :key="item.id" @click="$openrul(`/pages/teamInfo/teamInfo?id=${item.id}`)">
				<view class="news-item__content">
					<view class="lddq">
						<view class="news-item__content__title">{{ item.name }}</view>
						<view class="score news-item__content__title">
							{{ item.score }} <span style="font-size: 10px;font-weight: 400;">分</span>
						</view>
					</view>
					<view class="">
						<text style="font-size: 12px;color: #999;">团队任务：{{ item.task.name }}</text>
					</view>
					<view class="item-intro">
						<text class="sm text-gray cuIcon-read" style="margin-right: 20rpx;"></text> {{ item.detail }}
					</view>
					<view class="" style="vertical-align: middle;">
						<text class="sm text-gray cuIcon-group" style="margin-right: 20rpx;"></text> {{ item.team_useridsCount }} / {{ item.max_num }}
					</view>
					
					<view class="lddq" style="margin-top: 20rpx;">
						<view class="news-item__content__author" @tap="$openrul(`/pages/userInfo/userInfo?userid=${item.captain.id}`)">
							<view class="tx">
								<view class="sm cu-avatar round" :style="{'background-image':`url(${item.captain.avatar})`}"></view>
							</view>
							<view style="margin-left: 20rpx;">
								{{ item.captain.nickname }}
							</view>
						</view>
						<view class="">
							<button class="sm cu-btn round bg-blue" style="margin-bottom: 10rpx;" v-if="item.is_join === 0 && item.status === 0" @tap.stop="joinTeam(item.id)">加入团队</button>
							<button class="sm cu-btn round bg-green" style="margin-bottom: 10rpx;" v-if="item.is_join === 1" >已加入</button>
							<button class="sm cu-btn round bg-red" style="margin-bottom: 10rpx;" v-if="item.is_join === 2" >已拒绝</button>
							<button class="sm cu-btn round bg-yellow" style="margin-bottom: 10rpx;color: #fff;" v-if="item.status === 1" >已评分</button>
						</view>
					</view>
					
					

				</view>

				<!-- <view class="news-item__image">
					<image :src="item.imgUrl" mode="aspectFill"></image>
				</view> -->
			</view>
		</view>
		<!-- <loadMore /> -->
	</view>
</template>

<script>
	// import loadmore from 
export default {
	data() {
		return {
			header: {
					'token': ''
				},
			teamList:[],
			hasMore:true,
			teamListForm:{
				is_own:'',
				task_id:'',
				status:'',
				page:1,
				limit:1000
			},
			news: [
				
			]
		}
	},
	// components:{
		
	// },
	onLoad(query) {
		let token = JSON.parse(uni.getStorageSync('vuexvuex'))
			var parsedData = JSON.parse(token.value);
			var tokenValue = parsedData.userinfo.token;
			let domainPrefix = this.$myHttp.config.baseUrl;
		
			// domainPrefix = domainPrefix.replace(/\/$/, '');
			this.header['token'] = tokenValue;
		
		
		this.getTeamTaskList()
	
	},
	methods: {
		async joinTeam(id){
			uni.showModal({
			        title: '提示',
			        content: '是否加入该团队？',
			        showCancel: true, // 是否显示取消按钮
			        cancelText: '取消', // 取消按钮的文字
			        cancelColor: '#000000', // 取消按钮的文字颜色
			        confirmText: '确认', // 确认按钮的文字
			        confirmColor: '#3CC51F', // 确认按钮的文字颜色
			        success: (res) => {
			          if (res.confirm) {
			            // 用户点击了确认按钮
						 this.$myHttp.post({
							
							url: this.$myHttp.urlMap.joinTeam,
							data: {
								team_id:id
							},
							success: res => {
								if(res.data.code == 1){
									uni.showToast({
										title: '已提交申请',
										icon: 'none'
									});
								}
								console.log('%c [ this.rankingList ]-321321', 'font-size:13px; background:pink; color:#bf2c9f;', res)
							}
						}).then(
							console.log(321)
						)
						
			            
			          }
			        },
			      });
			
		},
		
		getTeamTaskList(){
			this.$myHttp.get({
				url: this.$myHttp.urlMap.currentTeamList + '?page=1&limit=1000&is_own=&task_id=&status=',
				needLogin: true,
				success: res => {
					this.teamList = res.data.data.data
					console.log('%c [ this.rankingList ]-251', 'font-size:13px; background:pink; color:#bf2c9f;', this.teamList)
				}
			})
			
		},
		gotoTeamDetail() {
			uni.navigateTo({
				url: '/pages/teamDetail/teamDetail'
			})
		}
	}
}
</script>

<style>
.container {
	padding: 10px;
	background-color: #f5f5f5;
}

.news-list {
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.news-item {
	border-radius: 5px;
	width: 100%;
	
	background-color: #fff;
	border-bottom: 1px solid #eee;
}

.news-item__content {
	position: relative;
	box-sizing: border-box;
	padding: 8px;
	width: 100%;
	
	float: left;
}

.news-item__content__title {
	padding-bottom: 4px;
	font-size: 18px;
	font-weight: 800;
	/* line-height: 100px; */
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
	white-space: normal !important;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.news-item__content__desc {
	font-size: 12px;
	line-height: 16px;
	/* line-height: 100px; */
	/* 副标题超过两行显示省略号 */
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
	white-space: normal !important;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.news-item__content__time {
	position: absolute;
	left: 10px;
	bottom: 10px;
	color: #999;
	font-size: 12px;

}


.news-item__content__author {
	
	color: #999;
	font-size: 12px;
	
	display: flex;
	align-items: center;

}


.news-item__content__author .tx {
	width: 27px;
	height: 27px;
}

.news-item__content__author .autname {
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
	white-space: normal !important;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.news-item__image {
	box-sizing: border-box;
	padding: 10px;
	width: 30%;
	height: 100%;
	float: left;
}

.news-item__image image {
	width: 100%;
	height: 100%;
}
</style>
